Project Desktop SnapProject Mobile Snap
See CodeWatch Live

Developed with

HTML
CSS
Javascript
React
Vite

SHOPPING CART

DESCRIPTION

The goal of this project was to create a mini e-commerce platform using React's router. The main focus was to develop an interface where users could browse products fetched from a mock API catalog and easily add or remove items from their shopping cart. This project also gave me the chance to work on responsiveness for the first time, ensuring the site adapts smoothly to different screen sizes.

STRUGGLES

One of the biggest challenges I faced was working with React Router, particularly when it came to structuring the components. I struggled to decide whether to organize all components under a single main directory or to create separate directories for each page. Another challenge was passing props to deeply nested components, which quickly became repetitive and inefficient. This is an area I plan to explore further in future projects to improve both code organization and scalability.

CONCLUSION

Overall, I really enjoyed watching this project come to life and evolve into something that feels like a real-world application. It helped me significantly improve my skills with React, particularly in areas like routing and responsiveness. While I'm proud of the progress I made, there’s still room for improvement. For instance, I need to implement input validation to prevent users from entering quantities less than one for any product. Despite these minor gaps, this project was a great learning experience that boosted my confidence in front-end development.


Are you already tired of exploring?

All Projects